<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="商品品牌" prop="brand">
        <el-input v-model="queryParams.brand" placeholder="请输入商品品牌" clearable @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="商品名称" prop="goodName">
        <el-input v-model="queryParams.goodName" placeholder="请输入商品名称" clearable @keyup.enter.native="handleQuery" />
      </el-form-item>
      <!-- <el-form-item label="商品服务" prop="goodEmploy">
        <el-input
          v-model="queryParams.goodEmploy"
          placeholder="请输入商品服务"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item> -->
      <el-form-item label="商品须知" prop="goodNotice">
        <el-input v-model="queryParams.goodNotice" placeholder="请输入商品须知" clearable @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="商品期限" prop="goodTerm">
        <el-input v-model="queryParams.goodTerm" placeholder="请输入商品期限" clearable @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="商品限制" prop="goodLimit">
        <el-input v-model="queryParams.goodLimit" placeholder="请输入商品限制" clearable @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="原价" prop="originalPrice">
        <el-input v-model="queryParams.originalPrice" placeholder="请输入原价" clearable @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="销售价" prop="salePrice">
        <el-input v-model="queryParams.salePrice" placeholder="请输入销售价" clearable @keyup.enter.native="handleQuery" />
      </el-form-item>
      <!-- <el-form-item label="主门店ID" prop="mainStore">
        <el-input
          v-model="queryParams.mainStore"
          placeholder="请输入主门店ID"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="门店IDS" prop="storeIds">
        <el-input
          v-model="queryParams.storeIds"
          placeholder="请输入门店IDS"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="点赞量" prop="likeVolume">
        <el-input
          v-model="queryParams.likeVolume"
          placeholder="请输入点赞量"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="收藏量" prop="collectionVolume">
        <el-input
          v-model="queryParams.collectionVolume"
          placeholder="请输入收藏量"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="销售量" prop="saleVolume">
        <el-input
          v-model="queryParams.saleVolume"
          placeholder="请输入销售量"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="评论数量" prop="observeNumber">
        <el-input
          v-model="queryParams.observeNumber"
          placeholder="请输入评论数量"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item> -->
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
          v-hasPermi="['system:goodInfo:add']">新增</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate"
          v-hasPermi="['system:goodInfo:edit']">修改</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
          v-hasPermi="['system:goodInfo:remove']">删除</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
          v-hasPermi="['system:goodInfo:export']">导出</el-button>
      </el-col>
      <el-col :span="1.5">
        <file-upload></file-upload>
        <!-- <el-button
          type="info"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleDaoru"
          v-hasPermi="['system:vlog:export']"
          >导入</el-button -->
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="goodInfoList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="编号" align="center" prop="id" />
      <el-table-column label="商品品牌" align="center" prop="brand" />
      <el-table-column label="商品名称" align="center" prop="goodName" />
      <el-table-column label="商品图标" align="center" prop="icon" width="100">
        <template slot-scope="scope">
          <image-preview :src="scope.row.icon" :width="50" :height="50" />
        </template>
      </el-table-column>
      <el-table-column label="商品展示图片" align="center" prop="goodImages" width="100">
        <template slot-scope="scope">
          <image-preview :src="scope.row.goodImages" :width="50" :height="50" />
        </template>
      </el-table-column>
      <!-- <el-table-column label="商品服务" align="center" prop="goodEmploy" /> -->
      <el-table-column label="商品须知" align="center" prop="goodNotice" />
      <el-table-column label="商品期限" align="center" prop="goodTerm" />
      <el-table-column label="商品限制" align="center" prop="goodLimit" />
      <el-table-column label="原价" align="center" prop="originalPrice" />
      <el-table-column label="销售价" align="center" prop="salePrice" />
      <!-- <el-table-column label="主门店ID" align="center" prop="mainStore" />
      <el-table-column label="门店IDS" align="center" prop="storeIds" /> -->
      <el-table-column label="点赞量" align="center" prop="likeVolume" />
      <el-table-column label="收藏量" align="center" prop="collectionVolume" />
      <el-table-column label="销售量" align="center" prop="saleVolume" />
      <el-table-column label="评论数量" align="center" prop="observeNumber" />
      <!-- <el-table-column label="团购详情" align="center" prop="groupDetail" /> -->
      <el-table-column label="是否上架" align="center" prop="isDis">
        <template slot-scope="scope">
          <el-switch v-model="scope.row.isDis" active-color="#13ce66" :active-value="0" :inactive-value="1"
            inactive-color="#999" @change="changeStatus(scope.row)">
          </el-switch>
        </template>
      </el-table-column>
      <el-table-column label="是否秒杀" align="center" prop="isSeckill">
        <template slot-scope="scope">
          <el-switch v-model="scope.row.isSeckill" active-color="#13ce66" :active-value="1" :inactive-value="0"
            inactive-color="#999" @change="changeSeckill(scope.row)">
          </el-switch>
        </template>
      </el-table-column>
      <!-- <el-table-column label="购买须知" align="center" prop="buyNotice" /> -->
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
            v-hasPermi="['system:goodInfo:edit']">修改</el-button>
          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
            v-hasPermi="['system:goodInfo:remove']">删除</el-button>
          <el-button v-if="scope.row.isSeckill == 1" size="mini" type="text" icon="el-icon-edit-outline"
            @click="handleseckill(scope.row)" v-hasPermi="['system:goodInfo:remove']">秒杀设置</el-button>
        </template>
      </el-table-column>
    </el-table>

    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
      @pagination="getList" />

    <!-- 添加或修改团购商品管理对话框 -->
    <el-dialog :title="title" :visible.sync="open" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="auto">
        <el-form-item label="商品品牌" prop="brand">
          <el-input v-model="form.brand" placeholder="请输入商品品牌" />
        </el-form-item>
        <el-form-item label="商品名称" prop="goodName">
          <el-input v-model="form.goodName" placeholder="请输入商品名称" />
        </el-form-item>
        <el-form-item label="服务类型">
          <el-radio-group v-model="isCar" @change="handleChangeServiceType">
            <el-radio :label="0">小石团购</el-radio>
            <el-radio :label="1">车主服务</el-radio>
            <el-radio label="">其他</el-radio>
          </el-radio-group>
        </el-form-item>

        <el-form-item label="商品类型" v-if="isCar !== ''">
          <el-cascader v-model="productTypes" :key="isCar" :options="optionList" clearable></el-cascader>
        </el-form-item>
        <el-form-item label="住房类型" class="custom-item">
          <el-radio-group v-model="roomType" @change="handleChangeRoomType">
            <el-radio :label="0">商品</el-radio>
            <el-radio :label="1">住房</el-radio>
          </el-radio-group>
          <el-form-item v-if="roomType === 1" style="margin-left: 16px;" prop="roomNumber">
            <el-input-number width="100" v-model="form.roomNumber" :min="0" placeholder="请输入房间数量" />
          </el-form-item>
        </el-form-item>
        <el-form-item v-if="roomType === 1" label="设置特价房">
          <el-table :data="form.goodsRooms" style="width: 100%">
            <el-table-column label="设置日期" class="room-date">
              <template #default="scope">
                <el-form-item :prop="'goodsRooms.' + scope.$index + '.roomDate'" :rules="rules.goodsRoomsDateRule">
                  <el-date-picker v-model="scope.row.roomDate" value-format="yyyy-MM-dd" type="date" placeholder="选择日期">
                  </el-date-picker>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column label="单价">
              <template #default="scope">
                <el-form-item :prop="'goodsRooms.' + scope.$index + '.price'" :rules="rules.goodsRoomsPriceRule">
                  <el-input-number size="small" :min="0" v-model="scope.row.price" :precision="2" placeholder="请输入单价"
                    style="width: 100%" />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column label="操作">
              <template #default="scope">
                <el-button type="danger" v-if="form.goodsRooms.length > 1" size="mini" plain
                  @click="handleDelRoom(scope.$index)">删除</el-button>
                <el-button type="success" v-if="scope.$index == form.goodsRooms.length - 1" size="mini" plain
                  @click="handldeAddRooms">新增</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-form-item>
        <el-form-item label="商品图标" prop="icon">
          <image-upload v-model="form.icon" />
        </el-form-item>
        <el-form-item label="商品展示图片" prop="goodImages">
          <image-upload v-model="form.goodImages" />
        </el-form-item>
        <!-- <el-form-item label="商品服务" prop="goodEmploy">
          <el-input v-model="form.goodEmploy" placeholder="请输入商品服务" />
        </el-form-item> -->
        <el-form-item label="是否填写预定信息">
          <el-radio-group v-model="form.isDue">
            <el-radio :label="0">否</el-radio>
            <el-radio :label="1">是</el-radio>
          </el-radio-group>
        </el-form-item>

        <el-form-item label="是否可退款">
          <el-radio-group v-model="form.isRefund">
            <el-radio :label="0">可退款</el-radio>
            <el-radio :label="1">不可退款</el-radio>
          </el-radio-group>
        </el-form-item>
        
        <el-form-item label="是否可售后">
          <el-radio-group v-model="form.isAfterSale">
            <el-radio :label="0">可售后</el-radio>
            <el-radio :label="1">不可售后</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="销售量" prop="saleVolume">
          <el-input v-model="form.saleVolume" placeholder="请输入销售量" />
        </el-form-item>
        <el-form-item label="商品须知" prop="goodNotice">
          <el-input v-model="form.goodNotice" placeholder="请输入商品须知" />
        </el-form-item>
        <el-form-item label="商品期限" prop="goodTerm">
          <el-input v-model="form.goodTerm" placeholder="请输入商品期限" />
        </el-form-item>
        <el-form-item label="商品有效期" prop="lifespan">
          <el-input v-model="form.lifespan" placeholder="请输入商品购买后的有效天数"
            @input="(v) => (form.lifespan = v.replace(/[^\d]/g, ''))" />
        </el-form-item>
        <el-form-item label="商品限制" prop="goodLimit">
          <el-input v-model="form.goodLimit" placeholder="请输入商品限制" />
        </el-form-item>
        <el-form-item label="商品限购数量" prop="quota">
          <el-input v-model="form.quota" placeholder="请输入商品限购数量"
            @input="(v) => (form.quota = v.replace(/[^\d]/g, ''))" />
        </el-form-item>
        <el-form-item label="商品标签" prop="goodEmploy">
          <el-select v-model="form.goodEmploy" multiple placeholder="请选择商品标签" style="width: 100%">
            <el-option v-for="item in tagList" :key="item.dictCode" :label="item.dictLabel"
              :value="String(item.dictCode)">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="评论标签" prop="evaluateDicts" >
          <el-select v-model="form.evaluateDicts" multiple placeholder="请选择商品标签" style="width: 100%">
            <el-option v-for="item in pltagList" :key="item.dictCode" :label="item.dictLabel"
              :value="String(item.dictCode)">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="原价" prop="originalPrice">
          <el-input v-model="form.originalPrice" placeholder="请输入原价" />
        </el-form-item>
        <el-form-item label="销售价" prop="salePrice">
          <el-input v-model="form.salePrice" placeholder="请输入销售价" />
        </el-form-item>
        <el-form-item label="主门店ID" prop="mainStore">
          <!-- <el-input v-model="form.mainStore" placeholder="请输入主门店ID" /> -->
          <el-select v-model="form.mainStore" placeholder="请选择主门店" style="width: 100%">
            <el-option v-for="item in mendianList" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="门店IDS" prop="storeIds">
          <!-- <el-input v-model="form.storeIds" placeholder="请输入门店IDS" /> -->
          <el-select v-model="form.storeIds" multiple placeholder="请选择关联门店" style="width: 100%">
            <el-option v-for="item in mendianList" :key="item.value" :label="item.label" :value="String(item.value)">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="序号" prop="sort">
          <el-input-number v-model="form.sort" style="width: 200px;"></el-input-number>
        </el-form-item>
        <!-- <el-form-item label="点赞量" prop="likeVolume">
          <el-input v-model="form.likeVolume" placeholder="请输入点赞量" />
        </el-form-item>
        <el-form-item label="收藏量" prop="collectionVolume">
          <el-input v-model="form.collectionVolume" placeholder="请输入收藏量" />
        </el-form-item>
        <el-form-item label="销售量" prop="saleVolume">
          <el-input v-model="form.saleVolume" placeholder="请输入销售量" />
        </el-form-item>
        <el-form-item label="评论数量" prop="observeNumber">
          <el-input v-model="form.observeNumber" placeholder="请输入评论数量" />
        </el-form-item> -->
        <el-form-item label="团购详情"></el-form-item>
        <div v-if="goodsGroups.length > 0" style="border: 1px solid #ddd; padding: 10px">
          <el-row v-for="(item, index) in goodsGroups" :key="index">
            一级标题：<el-input v-model="item.title" style="width: 300px"></el-input>
            <el-button style="margin-left: 10px" type="danger" size="mini" v-if="goodsGroups.length > 1"
              @click.prevent="btnTitle(1, index)">删除</el-button>
            <el-button style="margin-left: 10px" type="success" size="mini" v-if="index == goodsGroups.length - 1"
              @click.prevent="btnTitle(2, index)">新增</el-button>
            <div style="margin: 10px">
              <el-table :data="item.goodsDetailList" style="width: 100%">
                <el-table-column label="食品名">
                  <template #default="scope">
                    <el-input size="large" v-model="scope.row.detailName" placeholder="请输入食品名" style="width: 100%" />
                  </template>
                </el-table-column>
                <el-table-column label="食品单位">
                  <template #default="scope">
                    <el-input size="large" v-model="scope.row.detailUnit" placeholder="请输入食品单位" style="width: 100%" />
                  </template>
                </el-table-column>
                <el-table-column label="单价">
                  <template #default="scope">
                    <el-input size="large" v-model="scope.row.detailPrice" placeholder="请输入单价" style="width: 100%" />
                  </template>
                </el-table-column>
                <!-- <el-table-column label="图片">
                  <template #default="scope">
                    <image-upload v-model="scope.row.detailImg" />
                  </template>
                </el-table-column> -->
                <el-table-column label="操作">
                  <template #default="scope">
                    <el-button type="danger" size="mini" plain v-if="item.goodsDetailList.length > 1" @click.prevent="
                      btnContent(1, index, scope.$index, item.goodsDetailList)
                      ">删除</el-button>
                    <el-button type="success" size="mini" plain v-if="scope.$index == item.goodsDetailList.length - 1"
                      @click.prevent="
                        btnContent(2, index, scope.$index, item.goodsDetailList)
                        ">新增</el-button>
                  </template>
                </el-table-column>
              </el-table>
              <div style="display: flex; align-items: center; margin-top: 10px">
                图片：<image-upload v-model="item.detailImg" />
              </div>
            </div>
          </el-row>
        </div>

        <el-form-item label="购买须知"></el-form-item>
        <div style="border: 1px solid #ddd; padding: 10px">
          <el-row v-for="(item, index) in buyNotices" :key="index">
            标题：<el-input v-model="item.title" style="width: 300px"></el-input>

            <el-button style="margin-left: 10px" type="danger" size="mini" v-if="buyNotices.length > 1"
              @click.prevent="btnTitle2(1, index)">删除</el-button>
            <el-button style="margin-left: 10px" type="success" size="mini" v-if="index == buyNotices.length - 1"
              @click.prevent="btnTitle2(2, index)">新增</el-button>
            <div style="display: flex; align-items: center">
              图标：<image-upload v-model="item.icon" :limit="1" style="margin-top: 10px" />
            </div>

            <div style="margin: 10px">
              <el-table :data="item.contents" style="width: 100%">
                <el-table-column label="内容">
                  <template #default="scope">
                    <el-input type="textarea" size="large" v-model="scope.row.content" placeholder="请输入内容"
                      style="width: 100%" />
                  </template>
                </el-table-column>
                <el-table-column label="操作">
                  <template #default="scope">
                    <el-button type="danger" size="mini" plain v-if="item.contents.length > 1" @click.prevent="
                      btnContent2(1, index, scope.$index, item.contents)
                      ">删除</el-button>
                    <el-button type="success" size="mini" plain v-if="scope.$index == item.contents.length - 1"
                      @click.prevent="
                        btnContent2(2, index, scope.$index, item.contents)
                        ">新增</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </el-row>
        </div>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>

    <!-- 添加或修改商品秒杀设置对话框 -->
    <el-dialog title="商品秒杀设置" :visible.sync="open2" width="500px" append-to-body>
      <el-form ref="form" :model="form2" :rules="rules" label-width="auto">
        <el-form-item label="开始日期" prop="beginDate">
          <el-date-picker clearable v-model="form2.beginDate" type="date" value-format="yyyy-MM-dd"
            placeholder="请选择开始时间">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="每日开始时间" prop="beginTime">
          <el-time-select v-model="form2.beginTime" :picker-options="{
            start: '08:00',
            step: '00:30',
            end: '24:00',
          }" placeholder="选择开始时间">
          </el-time-select>
        </el-form-item>
        <el-form-item label="结束日期" prop="endDate">
          <el-date-picker clearable v-model="form2.endDate" type="date" value-format="yyyy-MM-dd" placeholder="请选择结束时间">
          </el-date-picker>
        </el-form-item>
        <!-- <el-form-item label="周期  1单次  2循环" prop="cycle">
          <el-input
            v-model="form2.cycle"
            placeholder="请输入周期  1单次  2循环"
          />
        </el-form-item> -->
        <el-form-item label="每日结束时间" prop="endTime">
          <el-time-select v-model="form2.endTime" :picker-options="{
            start: '08:00',
            step: '00:30',
            end: '24:00',
          }" placeholder="选择结束时间">
          </el-time-select>
        </el-form-item>
        <el-form-item label="秒杀价" prop="price">
          <el-input v-model="form2.price" placeholder="请输入秒杀价" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm2">确 定</el-button>
        <el-button @click="cancel2">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  listGoodInfo,
  getGoodInfo,
  delGoodInfo,
  addGoodInfo,
  updateGoodInfo,
} from "@/api/system/goodInfo";
import { listGoodStore } from "@/api/system/goodStore";
import { listData } from "@/api/system/dict/data";
import { listGoodsType } from "@/api/system/goodsType";
import {
  listSeckill,
  getSeckill,
  delSeckill,
  addSeckill,
  updateSeckill,
} from "@/api/system/seckill";
import { deepClone } from '@/utils/index'

export default {
  name: "GoodInfo",
  data() {
    var validateRoomType = (rule, value, callback) => {
      if (this.roomType === 1) {
        if (!value) {
          callback(new Error('请输入房间数量'));
        } else {
          callback();
        }
      } else {
        callback();
      }
    }
    var validateGoodsRoomDate = (rule, value, callback) => {
      if (this.roomType === 1) {
        if (!value) {
          callback(new Error('请输入房间数量'));
        } else {
          callback();
        }
      } else {
        callback();
      }
    }
    var validateGoodsRoomPrice = (rule, value, callback) => {
      if (this.roomType === 1) {
        if (!value) {
          callback(new Error('请输入房间单价'));
        } else {
          callback();
        }
      } else {
        callback();
      }
    }

    return {
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 团购商品管理表格数据
      goodInfoList: [],
      productTypes: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      open2: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        goodType: null,
        brand: null,
        goodName: null,
        icon: null,
        goodImages: null,
        goodEmploy: null,
        goodNotice: null,
        goodTerm: null,
        goodLimit: null,
        originalPrice: null,
        salePrice: null,
        mainStore: null,
        storeIds: null,
        likeVolume: null,
        collectionVolume: null,
        saleVolume: null,
        observeNumber: null,
        groupDetail: null,
        isDis: null,
        buyNotice: null,
      },
      // 表单参数
      form: {},
      form2: {},
      pltagList: [],
      options: [],
      options2: [],
      isCar: 0,
      roomType: 0,
      roomNumber: undefined,

      goodsGroups: [
        {
          title: "",
          goodsDetailList: [
            { detailName: "", detailUnit: "", detailPrice: "" },
          ],
          detailImg: "",
        },
      ],
      buyNotices: [
        {
          icon: "",
          title: "",
          contents: [{ content: "" }],
        },
      ],
      mendianList: [],
      tagList: [],
      // 表单校验
      rules: {
        goodName: [
          { required: true, message: "商品名称不能为空", trigger: "blur" },
        ],
        icon: [
          { required: true, message: "商品图标不能为空", trigger: "blur" },
        ],
        goodImages: [
          { required: true, message: "商品展示图片不能为空", trigger: "blur" },
        ],
        goodEmploy: [
          { required: true, message: "商品服务不能为空", trigger: "blur" },
        ],
        evaluateDicts: [
          { required: true, message: "评论标签不能为空", trigger: "blur" },
        ],
        goodNotice: [
          { required: true, message: "商品须知不能为空", trigger: "blur" },
        ],
        goodTerm: [
          { required: true, message: "商品期限不能为空", trigger: "blur" },
        ],
        goodLimit: [
          { required: true, message: "商品限制不能为空", trigger: "blur" },
        ],
        originalPrice: [
          { required: true, message: "原价不能为空", trigger: "blur" },
        ],
        salePrice: [
          { required: true, message: "销售价不能为空", trigger: "blur" },
        ],
        sort: [
          { required: true, message: "排序号不能为空", trigger: "blur" },
        ],
        mainStore: [
          { required: true, message: "主门店ID不能为空", trigger: "blur" },
        ],
        storeIds: [
          { required: true, message: "门店IDS不能为空", trigger: "blur" },
        ],
        groupDetail: [
          { required: true, message: "团购详情不能为空", trigger: "blur" },
        ],
        roomNumber: [
          { validator: validateRoomType, trigger: ['change', 'blur'] }
        ],
        goodsRoomsDateRule: [
          { validator: validateGoodsRoomDate, trigger: ['change', 'blur'] }
        ],
        goodsRoomsPriceRule: [
          { validator: validateGoodsRoomPrice, trigger: ['change', 'blur'] }
        ],
        isDis: [
          {
            required: true,
            message: "是否上架  0上架  1下架不能为空",
            trigger: "change",
          },
        ],
      },
    };
  },
  created() {
    this.getList();
    this.getList2();
    this.getTags();
    this.getplTags();
    this.getList3();
  },
  computed: {
    optionList() {
      if(this.isCar === 0) {
        return this.options
      } else if (this.isCar === 1) {
        return this.options2
      } else {
        return []
      }
      // return this.isCar === 0 ? this.options : this.options2
    }
  },
  methods: {
    /** 查询团购商品管理列表 */
    getList() {
      this.loading = true;
      listGoodInfo(this.queryParams).then((response) => {
        this.goodInfoList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    /** 查询门店管理列表 */
    getList2() {
      this.loading = true;
      listGoodStore({
        pageNum: 1,
        pageSize: 999,
      }).then((response) => {
        console.log(response, 'response')
        response.rows.forEach((item) => {
          this.mendianList.push({
            value: item.id,
            label: item.storeName,
          });
        });
        // this.goodStoreList = response.rows;
        // this.total = response.total;
        this.loading = false;
      });
    },
    /** 查询评论标签列表 */
    getplTags() {
      this.loading = true;
      listData({
        dictType: "hkeep_evaluate_label",
        pageSize: 9999,
      }).then((response) => {
        this.pltagList = response.rows;
      });
    },
    /** 查询字典数据列表 */
    getTags() {
      this.loading = true;
      listData({
        dictType: "sys_group_goods_label",
        pageSize: 9999,
      }).then((response) => {
        this.tagList = response.rows;
      });
    },
    /** 查询货品类型信息列表 */
    getList3() {
      this.loading = true;
      listGoodsType({
        pageNum: 1,
        pageSize: 999,
      }).then((response) => {
        // this.goodsTypeList = response.rows.filter(item=>item.isCar==0)
        // this.goodsTypeList2 = response.rows.filter(item=>item.isCar==1)
        const options = response.rows.filter((item) => item.isCar == 0);
        const options2 = response.rows.filter((item) => item.isCar == 1);
        // console.log(this.options, this.options2, 'getList3')
        this.options = options.map((item) => {
          let childrenList = [];
          if (item.children.length > 0) {
            childrenList = item.children.map((item2) => {
              return {
                label: item2.kindName,
                value: item2.id,
              };
            });
          }
          return {
            label: item.kindName,
            value: item.id,
            children: childrenList,
          };
        });
        this.options2 = options2.map((item) => {
          let childrenList = [];
          if (item.children.length > 0) {
            childrenList = item.children.map((item2) => {
              return {
                label: item2.kindName,
                value: item2.id,
              };
            });
          }
          return {
            label: item.kindName,
            value: item.id,
            children: childrenList,
          };
        });
        console.log(this.options, this.options2, 'options')
        this.loading = false;
      });
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    cancel2() {
      this.open2 = false;
      this.reset2();
      this.getList();
    },

    // 新增特价房
    handldeAddRooms() {
      const tempObj = {
        roomDate: '',
        price: undefined
      }
      this.form.goodsRooms.push(deepClone(tempObj))
    },
    // 删除特价房
    handleDelRoom(index) {
      this.form.goodsRooms.splice(index, 1)
    },
    
    // 服务类型切换
    handleChangeServiceType() {
      if (this.isCar !== '') {
        console.log(this.isCar, 'isCar')
        this.form.goodType = ''
      }
    },

    // 特价房按钮切换
    handleChangeRoomType() {
      if (this.roomType === 0) {
        this.form.roomNumber = undefined
        this.form.goodsRooms = [
          { roomDate: '', price: undefined }
        ]
      } else {
        this.$set(this.form, 'goodsRooms', [
          { roomDate: '', price: undefined }
        ])
      }
    },

    // 表单重置
    reset() {
      this.form = {
        id: null,
        goodType: null,
        brand: null,
        goodName: null,
        icon: null,
        goodImages: null,
        goodEmploy: null,
        goodNotice: null,
        goodTerm: null,
        goodLimit: null,
        originalPrice: null,
        salePrice: null,
        mainStore: null,
        storeIds: null,
        likeVolume: null,
        collectionVolume: null,
        saleVolume: null,
        observeNumber: null,
        groupDetail: null,
        isDis: null,
        buyNotice: null,
        isRefund: 0,
        isDue: 0,
        isAfterSale: 0,
        roomType: 0,
        roomNumber: null,
        sort: null,
      };
      (this.goodsGroups = [
        {
          title: "",
          goodsDetailList: [
            { detailName: "", detailUnit: "", detailPrice: "" },
          ],
          detailImg: "",
        },
      ]),
        (this.buyNotices = [
          {
            icon: "",
            title: "",
            contents: [{ content: "" }],
          },
        ]),
        this.resetForm("form");
    },
    reset2() {
      this.form2 = {
        goodId: null,
        beginDate: null,
        endDate: null,
        cycle: null,
        beginTime: null,
        endTime: null,
        price: null,
      };
      this.resetForm("form2");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.id);
      this.single = selection.length !== 1;
      this.multiple = !selection.length;
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.isCar = 0;
      this.title = "添加团购商品管理";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const id = row.id || this.ids;
      getGoodInfo(id).then((response) => {
        this.form = response.data;
        if (this.form.goodsType) {
          this.isCar = this.form.goodsType.isCar
        } else {
          this.isCar = ''
        }
        
        console.log(this.form, this.isCar, this.optionList, 'this.form')
        // this.optionList.filter()
        this.findIdByVal(this.form.goodType)
        this.roomType = this.form.roomType
        this.goodsGroups = this.form.goodsGroups;
        this.buyNotices = this.form.buyNotices;
        this.form.storeIds = this.form.storeIds
          ? this.form.storeIds.split(",")
          : null;
        this.form.evaluateDicts = this.form.evaluateDicts
          ? this.form.evaluateDicts.split(",")
          : null;
        this.form.goodEmploy = this.form.goodEmploy
          ? this.form.goodEmploy.split(",")
          : null;
        this.open = true;
        this.title = "修改团购商品管理";
      });
    },
    findIdByVal(val) {
      this.optionList.forEach(item => {
        item.children.forEach(jtem => {
          if (jtem.value === val) {
            this.productTypes = [item.value, jtem.value]
          }
        })
      })

    },
    /** 新增按钮操作 */
    handleAdd2(id) {
      this.reset2();
      this.form2.goodId = id;
      this.open2 = true;
    },
    // 修改秒杀设置
    handleseckill(row) {
      this.reset2();
      const goodId = row.id || this.ids;
      getSeckill(goodId).then((response) => {
        this.form2 = response.data;
        this.open2 = true;
      });
    },
    /** 删除按钮操作 */
    handleDelete2(row) {
      const goodIds = row.id || this.ids;
      this.$modal
        .confirm('是否确认删除商品秒杀设置编号为"' + goodIds + '"的数据项？')
        .then(function () {
          return delSeckill(goodIds);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {
          this.getList();
        });
    },
    //修改是否上架状态
    changeStatus(row) {
      updateGoodInfo(row).then((res) => {
        this.$modal.msgSuccess("修改成功");
        this.getList();
      });
    },
    // 修改秒杀状态
    changeSeckill(row) {
      updateGoodInfo(row).then((res) => {
        // this.$modal.msgSuccess("修改成功");
        // this.getList();
        if (row.isSeckill == 0) {
          this.handleDelete2(row);
        } else {
          this.handleAdd2(row.id);
        }
        this.getList();
      });
    },
    /** 秒杀提交按钮 */
    submitForm2() {
      addSeckill(this.form2).then((response) => {
        this.$modal.msgSuccess("成功");
        this.open2 = false;
        this.getList();
      });
      // this.$refs["form2"].validate((valid) => {
      //   if (valid) {
      //     if (this.form2.goodId != null) {
      //       updateSeckill(this.form2).then((response) => {
      //         this.$modal.msgSuccess("修改成功");
      //         this.open2 = false;
      //         this.getList();
      //       });
      //     } else {
      //       addSeckill(this.form2).then((response) => {
      //         this.$modal.msgSuccess("新增成功");
      //         this.open2 = false;
      //         this.getList();
      //       });
      //     }
      //   }
      // });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate((valid) => {
        
        if (valid) {
          this.form.roomType = this.roomType
          this.form.goodsGroups = this.goodsGroups;
          this.form.buyNotices = this.buyNotices;
          this.form.storeIds = this.form.storeIds.join(",");
          this.form.evaluateDicts = this.form.evaluateDicts.join(",");
          this.form.goodEmploy = this.form.goodEmploy.join(",");
          if (this.isCar === '') {
            this.$set(this.form, 'goodsType', {})
            this.$set(this.form, 'goodType', '')
          } else {
            
            this.form.goodType = this.productTypes[1]
          }
          console.log(this.form.goodType, this.isCar, 'submitForm')
          if (this.form.id != null) {
            console.log(this.form, this.isCar, 'valid')
            updateGoodInfo(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addGoodInfo(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const ids = row.id || this.ids;
      this.$modal
        .confirm('是否确认删除团购商品管理编号为"' + ids + '"的数据项？')
        .then(function () {
          return delGoodInfo(ids);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => { });
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download(
        "system/goodInfo/export",
        {
          ...this.queryParams,
        },
        `goodInfo_${new Date().getTime()}.xlsx`
      );
    },
    btnTitle(type, index) {
      if (type == 2) {
        this.goodsGroups.push({
          title: "",
          goodsDetailList: [
            { detailName: "", detailUnit: "", detailPrice: "" },
          ],
          detailImg: "",
        });
      } else {
        this.goodsGroups.splice(index, 1);
      }
    },
    btnTitle2(type, index) {
      if (type == 2) {
        this.buyNotices.push({
          icon: "",
          title: "",
          contents: [{ content: "" }],
        });
      } else {
        this.buyNotices.splice(index, 1);
      }
    },
    btnContent(type, index, index2, item) {
      if (type == 2) {
        item.push({ detailName: "", detailUnit: "", detailPrice: "" });
      } else {
        item.splice(index2, 1);
      }
    },
    btnContent2(type, index, index2, item) {
      if (type == 2) {
        item.push({ content: "" });
      } else {
        item.splice(index2, 1);
      }
    },
  },
};
</script>
<style>
.el-form-item.custom-item .el-form-item__content {
  display: flex;
  height: 36px;
  align-items: center;
}
</style>
